<!DOCTYPE html>
<html>

<head>
    <title>宝可梦可视化</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    {% block head %}
    {% endblock %}
</head>

<body>
    <div class="container">
        <div class="row clearfix">
            <div class="col-md-12 column">
                <div class="page-header">
                    <h1>
                        宝可梦可视化 <small>System</small>
                    </h1>
                </div>
                <div class="col-md-12 column">
                    <nav class="navbar navbar-default" role="navigation">
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse"
                                data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle
                                    navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span
                                    class="icon-bar"></span></button> <a class="navbar-brand" href="#">Pokemon</a>
                        </div>

                        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                            <ul class="nav navbar-nav">
                                <li class="active">
                                    <a href="/">首页</a>
                                </li>
                                <li>
                                    <a href="#">Link</a>
                                </li>
                            </ul>
                            <form class="navbar-form navbar-left" role="search" action="/search" method="get">
                                <div class="form-group">
                                    <select class="form-control" name="stype" id="stype">
                                        <option value="id">ID</option>
                                        <option value="chinese_name">中文名</option>
                                        <option value="english_name">英文名</option>
                                        <option value="japanese_name">日文名</option>
                                        <!-- <option value="height">身高</option>
                                        <option value="weight">体重</option>
                                        <option value="type">类型</option>
                                        <option value="ability">能力</option>
                                        <option value="隐藏特性">隐藏特性</option>
                                        <option value="进化">进化</option>
                                        <option value="进化等级">进化等级</option>
                                        <option value="属性相性">属性相性</option> -->
                                      </select>
                                </div>
                                <div class="form-group">
                                    <input type="text" class="form-control" name="wd"/>
                                </div>
                                <button type="submit" class="btn btn-default">搜索</button>
                            </form>
                            <ul class="nav navbar-nav navbar-right">
                                <li>
                                    <a href="/login">登录</a>
                                </li>
                                <li>
                                    <a href="/register">注册</a>
                                </li>

                            </ul>
                        </div>

                    </nav>
                </div>
            </div>
        </div>
        <div class="row clearfix">
            <div class="col-md-12 column">
                {% block content %}

                {% endblock %}
            </div>
        </div>
    </div>
    <script>
        var param="{{stype}}";
		$("#stype").find("option[value="+param+"]").attr('selected','selected');
    </script>
    {% block js %}
    {% endblock %}

</body>

</html>